<template>
  <div>
    <el-row>
      <el-col span="3" :offset="3" id="str">
        账号：
      </el-col>
      <el-col span="12">
        <el-input v-model="user.account" placeholder="请输入内容" :disabled="true"></el-input>
      </el-col>
    </el-row>
    <br />
    <el-row>
      <el-col span="3" :offset="3" id="str">
        用户名：
      </el-col>
      <el-col span="12">
        <el-input v-model="user.accountName" placeholder="请输入内容"></el-input>
      </el-col>
    </el-row>
    <br />
    <el-row>
      <el-col span="3" :offset="3" id="str">
        电话：
      </el-col>
      <el-col span="12">
        <el-input v-model="user.accountPhone" placeholder="请输入内容"></el-input>
      </el-col>
    </el-row>
    <br />
    <el-row>
      <el-col span="3" :offset="3" id="str">
        邮箱：
      </el-col>
      <el-col span="12">
        <el-input v-model="user.accountEmail" placeholder="请输入内容"></el-input>
      </el-col>
    </el-row>
    <el-row>
      <el-col span="3" :offset="3" id="str" style="margin-top: 20px;">
        头像：
      </el-col>
      <el-col span="12" style="margin-top: 20px;">
        <div>
          <el-upload action="http://localhost:8888/repairAttachment/upload" list-type="picture-card"
            :on-preview="handlePictureCardPreview" :on-success="success" :on-remove="handleRemove">
            <i class="el-icon-plus"></i>
          </el-upload>
          <el-dialog :visible.sync="dialogVisible">
            <img width="100%" :src="dialogImageUrl" alt="">
          </el-dialog>
        </div>
      </el-col>
    </el-row>
    <div>
      <el-button type="primary" @click="serUser()" style="margin-left: 500px;margin-top: 90px;">确认修改</el-button>
    </div>

  </div>
</template>

<script>
  export default {
    name: "SetPersonalInformation",
    data() {
      return {
        user: JSON.parse(localStorage.getItem("user")).data,
        dialogImageUrl: '',         dialogVisible: false,         ossurl: "",
      }
    },
    methods: {
      handleRemove(file, fileList) {
        console.log(file, fileList);
      },
      handlePictureCardPreview(file) {
        this.dialogImageUrl = file.url;
        this.dialogVisible = true;
      },
      success(response, file, fileList) {
        console.log(response)
        this.ossurl = response.data
        this.user.accountTouxin=this.ossurl


      },
      //修改个人信息
      serUser() {
        this.$http.post("/account/setAccount", this.user).then(resp => {
          if (resp.data.code == 200) {
            alert("修改成功")
            console.log(resp)
            this.user = resp.data.data
            localStorage.setItem("user", JSON.stringify(resp.data))
          }
          console.log(this.user)
        })
      }
    },
    created() { //vue对象创建之后

    }
  }
</script>

<style>
</style>
